<template>
    <div>
        <!-- 酒店信息 E -->

        <!-- 预订限制 S -->
        <!--<div class="limit-panel mod-wrap" id="_j_limit_container" name="limit">
            <div class="mod-title">订前阅读<i class="i-arrow"></i></div>
            <div class="mod-bd"></div>
        </div>-->

        <!-- 预订限制 E -->

        <!-- 填写表单 S -->
        <div class="form-panel">
            <!-- 房间信息 S -->
            <div class="form-block form-room" id="_j_form_room_container">
                <div class="room-item text-left">
                    <div class="mod-title">
                        房间
                        <em class="room-index">1</em>
                        -
                        <em class="room-name">榻榻米标准间</em>
                        (必填)
                    </div>

                    <p class="sub">
                        入住信息：
                        <span class="text">2成人</span>
                        <span class="text plain-container _j_plain_select_container show">
                            <span class="ui-plain">
                                <em>2张单人床</em>
                                <input type="hidden" name="select"/>
                            </span>
                        </span>
                    </p>

                    <div class="extra-tips" style="top: 251px; left: 325px;">
                        此入住人数为查询价格时设置的人数,如变更请在前一页日期旁修改并重新查询价格
                    </div>

                    <div class="f-row select-container _j_select_container"></div>
                    <div class="line"></div>
                    <div class="name-list-container _j_name_list_container">
                        <div class="f-row">
                            <div class="ui-input ui-input-error">
                                <input type="text" class="last-name input-name" id="surname"/>
                                <label>姓</label>
                                <i class="icon-success"></i>
                            </div>

                            <div class="ui-input ui-input-error">
                                <input type="text" class="first-name input-name" id="name"/>
                                <label>名</label>
                                <i class="icon-success"></i>
                            </div>

                            <span class="tips-err" style="display: none">
                                <i></i>
                                <em class="tips-err-text">请填写姓名</em>
                            </span>

                            <a class="btn-people" href="javascript:void(0);">
                                <i class="i-add"></i>增加入住人信息
                            </a>
                        </div>
                        <!--提示-->
                        <div class="tips" style="padding-top: 0; padding-bottom: 10px;">
                            *请按相应证件准确填写第一入住人信息，订单提交后将无法变更或收费变更。
                        </div>
                        <div class="tips">
                            *<span class="tips-language">与证件姓名一致</span>，填写1人即可。
                            <div class="tips-question">
                                <i></i>
                                <div class="tips-cont">
                                    第二位住客姓名仅用于办理签证等手续，办理入住时，请出示第一位住客的护照。预订多间客房时，每间第一位住客请务必填写不同的入住人。
                                    <br>
                                    *若购买酒店取消险，请填写全部入住人。
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 房间信息 E -->
            <div class="form-block form-contact text-left" id="_j_contact_information_container">
                <div class="mod-title">联系人信息 (必填)</div>
                <div class="f-row">
                    <div class="ui-input ui-input-long">
                        <input type="text" class="name input-name" input-name="name" id="names">
                        <label>姓名</label>
                        <i class="icon-success"></i>
                    </div>
                    <span class="tips-err" style="display: none;"><i></i><em class="tips-err-text"></em></span>
                </div>
                <div class="f-row">
                    <div class="phone-ex-container" id="_j_phone-ex-container">
                        +<span class="phone-ex">86</span>
                    </div>
                    <div class="ui-input ui-input-long" style="width: 286px;">
                        <input type="text" class="phone input-name" id="mobile" input-name="phone" style="width: 269px;">
                        <label>手机</label>
                        <i class="icon-success"></i>
                    </div>
                    <span class="tips-err" style="display: none;"><i></i><em class="tips-err-text"></em></span>
                </div>
                <div class="f-row">
                    <div class="ui-input ui-input-long">
                        <input type="text" class="email input-name" id="email" input-name="email">
                        <label>电子邮箱</label>
                        <i class="icon-success"></i>
                    </div>
                    <span class="tips-err" style="display: none;"><i></i><em class="tips-err-text"></em></span>
                </div>
            </div>

            <!--特殊要求-->
            <div class="special-panel mod-wrap text-left" id="_j_special_panel_container" style="height: 26px;">
                <div class="mod-title special">特殊要求<i class="i-arrow"></i>
                </div>
            </div>

            <!--报销凭证-->
            <div class="invoice-panel mod-wrap text-left" id="_j_invoice_panel_container">
                <div class="mod-title">需要发票</div>
                <!--<div class="invoice-switch-btn-container _j_invoice_switch_btn_container">
                    <input type="checkbox" name="invoice-switch-btn" id="invoice-btn" class="invoice-switch-btn"/>
                    <label class="invoice-btn"></label>
                </div>-->
                <div class="tips">
                    此订单由供应商开具增值税普通发票。电子发票将在入住完成后1周内发送至联系人的邮箱。成功入住后6个月内仍可以申请补开发票。
                </div>
            </div>

            <!--蜂蜜抵制-->
            <div class="invoice-panel mod-wrap mod-wrap text-left" style="height: 26px;">
                <div class="mod-title">
                    蜂蜜抵现<i class="i-arrow"></i>
                </div>
            </div>
        </div>
        <!--确认支付  href="/optimization/ConfirmPayment"-->
        <a class="btn-action" href="#" @click="query">
            提交订单（¥{{iasd.price1}}<span class="_j_final_confirm_price"></span>）
        </a>
    </div>
</template>

<script>
    export default {
        props: ["iasd"],
        name: "FormPanel"
        ,date() {

        },methods: {
            query() {
                const name = document.getElementById("names").value;
                const phone=document.getElementById("mobile").value;
                const email=document.getElementById("email").value;
                if (name!=null && name!==''){
                    // this.$emit("query",name,mobile,email);
                    alert("aaa");
                    // eslint-disable-next-line no-unused-vars
                    let data={"name":name,"phone":phone,"email":email,"roomId":this.$route.query.id,"hotelId":this.$route.query.hotelId,"cit":this.$route.query.sCheckIn,"cot":this.$route.query.sCheckOut,"count":this.$route.query.sRoom}
                    const _this = this;
                    this.$axios.post(this.SEARCHS+'/api/hotelOrder',data).then(function (res) {
                        alert("aa");
                        if (res.data["success"]){
                            // this.$router.push({ path:'/optimization/ConfirmPayment?orderNo='});
                            // eslint-disable-next-line no-empty
                            // alert(res.data['data'].orderNo)
                            alert(res.data['data'].orderNo)
                            _this.$router.push({
                                path:"/optimization/ConfirmPayment?orderNo1="+res.data['data'].orderNo+"&price="+res.data['data'].hotelOrder.price
                            })
                            // eslint-disable-next-line no-empty
                        }else{

                        }
                    })

                }
            }
        }
    }
</script>

<style scoped>
    .text-left{
        text-align: left;
    }

</style>